<template>
	<view class="dialog-container" v-if="display">
		<view class="dialog-background" @click="clickToHide"></view>//遮罩
			<view class="dialog-main">
				<view class="dialog-tiele">{{title}}</view>
					<slot></slot>
				<text class="dialog-btn">{{confirmText}}</text>
			</view>//主窗体
		 
	</view>
</template>

<script>
	export default {
		name:"dialog-shell",
		props: {
			title: {
				type: String,
				required: true,
				Validator: (val) => {
					return val = length > 0
				}
			},
			confirmText: {
				type: String,
				default: "确定",
				required:false,
				Validator:(val) => {
					return val.length > 0
				}
			}
		},
		data() {
			return {
				display: true
			};
		},
		methods:{
			clickToHide(){
				this.display = false
			
		},
		show(){
			this.display = true
		}
		}
	}
</script>

<style>
@import url("dialog-shell.css");
</style>